<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>HTML标签</title>
		<style>
			span {
				color: red;
			}
		</style>
	</head>
	<body>
		<!-- hbuilder快捷键
			1.ctrl+s 保存
			2.ctrl+? 快速注释以及取消注释，单行只需要把光标放在内容里面，多行注释需要选中多行。
			3.标签写法快捷键，英文输入法，输入标签名字然后按tab键
			4.ctrl+k 一建排版代码
		 -->
		<!-- 
		如果没有写入样式，那么span标签和纯文本效果一样。
		行内元素。
		用span标签对文字进行包裹，有利于我们对文字进行样式控制 
		-->
		<p>Hello <span>world</span> hello html</p>
		<!-- 多行注释
		第一行
		第二行 -->
		<!-- 段落标签p
		 1.段落标签会换行
		 2.默认有外边距，即会表现出上下有空白。
		 3.段落标签是块级元素。
		 -->
		<p>君不见黄河之水天上来</p>
		<p>奔流到海不复回</p>
		<p>君不见高堂明镜悲白发</p>
		<p>朝如青丝暮成雪</p>
		<!-- 错误写法，用行内元素嵌套块级元素 -->
		<span>span标签<p>嵌套p标签</p></span>
		<!-- h1-h6:1.代表不同层级的标题
					2.都是块级元素
					3.一个页面最好使用一个h1，h1在搜索引擎的重要性仅次于title，多个h1不利于seo 
		-->
		<h1>一级标题，最大的标题</h1>
		<h2>二级标题</h2>
		<h6>六级标题</h6>
		<h7>h7标签</h7><span>测试</span>
		<h1>第一章</h1>
		<h2>第一节</h2>
		<h3>html</h3>
		<!-- 在编辑器中输入多个空白、换行、tab，最终在浏览器中所有的空白都会转换为一个空格。如果先保持编辑器中文档的格式，可以通过css的white-space属性来控制。 -->
		<p>
			测 试多个换

			行空白以及t ab
		</p>
		<!-- 文本格式化 -->
		<b>b标签</b>
		<i>i标签</i>
		<strong>strong标签</strong>
		<sup>上标</sup>
		<sub>下标</sub>
		<span><sup>o</sup>C</span>
		<ins>ins插入字</ins>
		<del>del 删除字</del>
		<em>em 着重字</em>

		<!-- 语义引用 -->
		<address>isaac_1643@163.com</address>
		<blockquote cite="https://www.huxley.net/bnw/four.html">
			<p>Words can be like X-rays, if you use them properly—they’ll go through anything. You read and you’re pierced.</p>
			<footer>—Aldous Huxley, <cite>Brave New World</cite></footer>
		</blockquote>
		Words can be like X-rays,<br><br> if you use them 
	</body>
</html>
